<template>
  <c-dialog ref="dialog" :data="selData" single warn-text="客户经理自检" title="客户经理自检" @open="openHandle">
    <c-list ref="form" :model="formData" :rules="formRules" label-width="130px">
      <c-list-item label="软装陈列任务号" :value="detail.softwearTaskCode" />
      <c-list-item label="所属门店" :value="detail.shopName" />
      <c-list-item label="装修任务号" :value="detail.decorationTaskCode" />
      <c-list-item
        prop="selfCheckingTime"
        label="自检时间"
      >
        <el-date-picker
          v-model="formData.selfCheckingTime"
          type="date"
          format="yyyy-MM-dd"
          value-format="yyyy-MM-dd HH:mm:ss"
          placeholder="选择日期"
          clearable
        />
      </c-list-item>
      <c-list-item
        prop="demandToStoreDisplayTime"
        label="需求到店陈列时间"
      >
        <el-date-picker
          v-model="formData.demandToStoreDisplayTime "
          type="date"
          format="yyyy-MM-dd"
          value-format="yyyy-MM-dd HH:mm:ss"
          placeholder="选择日期"
          clearable
        />
      </c-list-item>
      <c-list-item required label="自检资料审核">
        <import-file
          :data="fileList"
          :config-attachment-id="fileConfig.id||''"
          :limit="20"
          :file-type="fileConfig.fileTypeName"
          @remove="changeFile"
          @upload-success="changeFile"
        />
      </c-list-item>
      <c-list-item required label="现场视频">
        <import-file
          :data="fileListVideo"
          :config-attachment-id="fileVideoConfig.id||''"
          :limit="20"
          :file-type="fileVideoConfig.fileTypeName"
          @remove="changeFileVideo"
          @upload-success="changeFileVideo"
        />
      </c-list-item>
      <c-list-item>
        <div class="btn-container">
          <c-button @click="cancelHandle">取消</c-button>
          <c-button :loading="saveLoading" type="primary" @click="confirmHandle">确认</c-button>
        </div>
      </c-list-item>
    </c-list>
  </c-dialog>
</template>
<script>
import importFile from '@/components/importFile'
import { selfCheck, postConfigAttachmentTemplate, getShopAttachment } from '@/api/softDecorate'
export default {
  name: 'SelfChecking',
  components: { importFile },
  props: {
    selData: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      saveLoading: false,
      fileConfig: {},
      fileVideoConfig: {},
      fileList: [],
      fileListVideo: [],
      formData: {
        shopAttachmentDTOList: [],
        selfCheckingTime: '',
        demandToStoreDisplayTime: ''
      },
      formRules: {
        demandToStoreDisplayTime: [{ required: true, message: '请选择时间', trigger: 'change' }],
        selfCheckingTime: [{ required: true, message: '请选择时间', trigger: 'change' }]
      }
    }
  },
  computed: {
    detail() {
      return this.selData.length > 0 ? this.selData[0] : {}
    }
  },
  async  created() {
    const { selfCheckingTime, demandToStoreDisplayTime, shopAttachmentDTOList } = this.detail
    this.formData = { selfCheckingTime, demandToStoreDisplayTime, shopAttachmentDTOList }
  },
  methods: {
    async  openHandle() {
      await postConfigAttachmentTemplate().then(res => {
        console.log(res.data.records)
        if (res.success === 1 && res.data.records.length > 0) {
          const temp1 = res.data.records.filter(v => v.attachmentType === '自检资料审核')
          const temp2 = res.data.records.filter(v => v.attachmentType === '现场视频')

          if (temp1.length) this.fileConfig = temp1[0]
          if (temp2.length) this.fileVideoConfig = temp2[0]
        }
      })
      this.getFiles()
    },
    // 文件上传成功
    changeFile(data) {
      console.log(data)
      this.fileList = data.list
    },
    // 文件上传成功
    changeFileVideo(data) {
      this.fileListVideo = data.list
    },
    // 获取附件
    getFiles() {
      if (!this.detail.id) return
      getShopAttachment(this.detail.id).then(res => {
        this.fileList = res.data.records.filter(i => i.attachmentType === '自检资料审核')
        this.fileListVideo = res.data.records.filter(i => i.attachmentType === '现场视频')
      })
    },
    confirmHandle() {
      this.$refs.form.validate().then(() => {
        const files1 = this.fileList.filter(v => v.dr !== 1)
        const files2 = this.fileListVideo.filter(v => v.dr !== 1)
        if (files1.length === 0) {
          this.$message.warning('请上传【自检资料审核】附件')
          return
        }
        if (files2.length === 0) {
          this.$message.warning('请上传【现场视频】附件')
          return
        }
        const data = {
          id: this.detail.id,
          shopAttachmentDTOList: [...files1, ... files2],
          selfCheckingTime: this.formData.selfCheckingTime,
          demandToStoreDisplayTime: this.formData.demandToStoreDisplayTime
        }

        console.log(data)
        // return
        this.saveLoading = true
        selfCheck(data).then(res => {
          this.$message.success('操作成功！')
          this.$emit('on-success')
          this.saveLoading = false
          this.$refs.dialog.visible = false
        }).catch(() => {
          this.saveLoading = false
        })
      })
    },
    cancelHandle() {
      this.$refs.dialog.visible = false
    }
  }
}
</script>
